<template>
  <div class="notice-page flex flex-column">
    <div class="notice-content">
      {{ content }}
    </div>


    <div class="fix-footer flex flex-justify">
      <div class="exit-button tools-btn" @click="closeWindow">
        不同意，退出
      </div>
      <div class="success-button tools-btn" @click="onClick">
        我已了解，下一步
      </div>
    </div>
  </div>
</template>

<script>
import process from '@/logic/process';
import { useService } from '@/utils/services';
import { closeWindow } from '@/utils/weixin';
export default {
  setup() {
    const actions = useService();

    const onClick = () => {
      actions.hos.finishNotice().finally(() => {
        process.next();
      });
    };

    return { onClick, content: process.content, closeWindow };
  }
};
</script>

<style lang="scss" scoped>
.notice-page {
  background: #fff;
  height: 100vh;

  .notice-content {
    padding: 68px;
    font-size: 30px;
    font-weight: 300;
    color: #777b8f;
    line-height: 42px;
    flex: 1;
    text-indent: 60px;
  }

  .fix-footer {
    padding: 0 70px;
    padding-bottom: 201px;
  }

  .tools-btn {
    width: 280px;
    height: 80px;
    border-radius: 8px;
    font-weight: 500;
    line-height: 80px;
    font-size: 30px;
    text-align: center;
  }

  .exit-button {
    color: #07c160;
    background: rgba(0, 0, 0, 0.05);
  }
  .success-button {
    color: #fff;
    background: #07c160;
  }
}
</style>